<template>
	<view style="margin-left: 15rpx;margin-right: 15rpx;">
		<view v-if="formOpen">
			<view v-if="formType === 0" class="form-conf">
				<!-- <parser ref="internalFormParser"
                :key="new Date().getTime()"
                :form-conf="internalFormConf"
                @submit="submit"
                @save-as-draft="saveAsDraft"
                @getData="getData"/> -->
				<view>暂不支持内置表单</view>
			</view>
			<view v-if="formType === 1">
				<component
					ref="externalForm"
					:is="externalFormComponent"
					:process-definition-id="definitionId"
					:flow-data-prop="flowData"
					@save-as-draft="saveAsDraft"
					@submit="submit"
				/>
			</view>
		</view>
	</view>
</template>

<script>
import { externalFormCompReg } from '@/pages/flowableplus/work/mixins/externalFormCompReg.js';

export default {
	name: 'WorkStart',
	mixins: [externalFormCompReg],
	components: {},
	data() {
		return {
			definitionId: null,
			deployId: null,
			procInsId: null,
			formOpen: false,
			formKey: null,
			internalFormConf: {},
			formType: null,
			formRouteKey: null,
			externalFormComponent: null,
			flowData: {
				flow: {
					flowName: ''
				},
				curTask: {},
				currentUser: {}
			}
		};
	},
	computed: {
		
	},
	onLoad(params) {
		// console.log("params",params);
		this.initData(params);
	},
	created(params) {
		
	},
	methods: {
		initData(params = {}) {
			this.deployId = params.deployId;
			this.definitionId = params.definitionId;
			this.procInsId = params.procInsId;
			this.flowData.currentUser.currentUserId = this.vuex_userId;
			this.flowData.currentUser.currentUserDeptId = this.vuex_deptId;
			this.$u.api.wflow.process.getProcessDeployForm({
				definitionId: this.definitionId,
				deployId: this.deployId,
				procInsId: this.procInsId
			}).then((res) => {
				if (res.data) {
					this.formKey = res.data.formKey;
					this.formType = res.data.formType;
					this.flowData.flow.flowName = res.data.formName;
					if (this.formType === 0) {
						// 内置表单
						this.internalFormConf = res.data.formConf;
					} else if (this.formType === 1) {
						// 外置表单
						this.formRouteKey = res.data.routeKey;
						this.externalFormComponent = this.getExternalFormComponent(this.formRouteKey).component;
					}
					this.formOpen = true;
					// this.getDraft();
				}
			});
		},
		/**
		 * 获取关联的草稿数据
		 *
		 */
		getDraft() {
			let params = {
				createUser: this.vuex_userId,
				procDefId: this.definitionId,
				formKey: this.formKey
			};
			this.$u.api.wflow.draft.getDraftDetail(params).then((res) => {
				let draftData = res.data;
				if (draftData && draftData.id && draftData.variables) {
					this.doRecoverDraft(draftData.variables);
				}
			});
		},
		doRecoverDraft(variables) {
			let vm = this;
			uni.showModal({
				title: '提示',
				content: '是否恢复之前保存的草稿？',
				showCancel: true,
				success: function (res) {
					if (res.confirm) {
						let formVariablesData = JSON.parse(variables);
						if (vm.formType === 0) {
							vm.$refs.internalFormParser.setDefaultFormDataByOuter(formVariablesData);
						} else if (vm.formType === 1) {
							vm.$refs.externalForm.formData = formVariablesData;
						}
					}
				}
			});
		},
		/** 接收子组件传的值 */
		getData(data) {
			if (data) {
				const variables = [];
				data.fields.forEach((item) => {
					let variableData = {};
					variableData.label = item.__config__.label;
					// 表单值为多个选项时
					if (item.__config__.defaultValue instanceof Array) {
						const array = [];
						item.__config__.defaultValue.forEach((val) => {
							array.push(val);
						});
						variableData.val = array;
					} else {
						variableData.val = item.__config__.defaultValue;
					}
					variables.push(variableData);
				});
				this.variables = variables;
			}
		},
		submit(data) {
			let vm = this;
			let formInfo = {
				formKey: this.formKey,
				formType: this.formType,
				routeKey: this.formRouteKey
			};
			let processData = {
				formInfo: formInfo
			};
			if (data && this.definitionId) {
				// 启动流程并将表单数据加入流程变量
				if (this.formType === 0) {
					// 内置表单的数据
					processData.formData = data.valData;
				} else if (this.formType === 1) {
					// 外置表单的数据
					processData.formData = data;
				}
				startProcess(this.definitionId, processData)
					.then((res) => {
						this.$u.toast(res.data.msg);
					})
					.catch((error) => {
						console.error(error);
					})
					.finally(() => {});
			}
		},
		saveAsDraft(data) {
			let vm = this;
			let draftData = {
				procDefId: this.definitionId,
				formKey: this.formKey,
				createUser: this.userInfo.user_id
			};
			if (this.formType === 0) {
				draftData.variables = JSON.stringify(data.valData);
			} else if (this.formType === 1) {
				draftData.variables = JSON.stringify(data);
			}
			uni.showModal({
				title: '提示',
				content: '确认保存至草稿箱并关闭？',
				showCancel: true,
				success: function (res) {
					if (res.confirm) {
						vm.$u.api.wflow.draft.addDraft(draftData).then((res) => {
							if (res.success) {
								vm.$u.toast('草稿保存成功');
							}
						});
					}
				}
			});
		}
	}
};
</script>

<style lang="scss" scoped>
	.form-conf {
		margin: 15px auto;
		width: 80%;
		padding: 15px;
	}
</style>
